// TypeScale
$md_sys_typescale_body-large_size: 16px;

@use "sass:math";
@use "./_color-variables";

// Colors
$success-color: colorFunc("green", "base") !default;
$link-color: colorFunc("light-blue", "darken-1") !default;

// Floating buttons
$button-floating-background: var(--md-sys-color-secondary) !default;
$button-floating-background-hover: var(--md-ref-palette-secondary70) !default;
$button-floating-background-focus: var(--md-ref-palette-secondary80) !default;
$button-floating-color: var(--md-sys-color-on-secondary) !default;
$button-floating-size: 40px !default;
$button-floating-radius: 16px !default;

// Dropdown
$dropdown-item-height: 50px !default;

// Media Query Ranges
$small-screen-up: 601px !default;
$medium-screen-up: 993px !default;
$large-screen-up: 1201px !default;
$small-screen: 600.99px !default;
$medium-screen: 992.99px !default;
$large-screen: 1200.99px !default;

$medium-and-up: "only screen and (min-width : #{$small-screen-up})" !default;
$large-and-up: "only screen and (min-width : #{$medium-screen-up})" !default;
$extra-large-and-up: "only screen and (min-width : #{$large-screen-up})" !default;
$small-and-down: "only screen and (max-width : #{$small-screen})" !default;
$medium-and-down: "only screen and (max-width : #{$medium-screen})" !default;
$medium-only: "only screen and (min-width : #{$small-screen-up}) and (max-width : #{$medium-screen})" !default;

// Grid
$num-cols: 12 !default;
$gutter-width: 1.5rem !default;
$element-top-margin: math.div($gutter-width, 3) !default;
$element-bottom-margin: math.div($gutter-width * 2, 3) !default;

// Typography
$font-stack: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !default;
$text-color: var(--md-sys-color-on-background) !default;

// Header Styles
$h1-fontsize: 4.2rem !default;
$h2-fontsize: 3.56rem !default;
$h3-fontsize: 2.92rem !default;
$h4-fontsize: 2.28rem !default;
$h5-fontsize: 1.64rem !default;
$h6-fontsize: 1.15rem !default;

// Flow Text
$intervals: 20 !default;
$interval-size: math.div($large-screen - $small-screen, $intervals) !default;
